<template>
  <div class="acknowledgementOfOrder">
    <CDWHeader title="确认订单" />
    <!-- 商品简介、兑换积分、兑换时间。state(1：实物；2：虚拟；3:优惠券) -->
    <ProductIntroduction :state="this.state" :orderInfo="this.orderInfo" />
    <!-- 选择配送方式 -->
    <DistributionMode :orderInfo="this.orderInfo" />
    <!-- 收货人信息填写 -->
    <ConsigneeInformationEdit
      :orderInfoObject="orderInfo"
      ref="consigneeInformationEdit"
      :show="this.orderInfo.goodsType == 2"
      @success="success"
      :shipTypeB="shipTypeD"
    />

    <div class="goods-action">
      <div class="goods-btn" @click="showClick">确认兑换</div>
    </div>
    <div>
      <van-dialog
        v-model="show"
        title="兑换成功"
        message="可到“兑换详情”中查看"
        confirmButtonText="我知道了"
        @confirm="confirmFn"
      >
      </van-dialog>
    </div>
  </div>
</template>

<script>
import CDWHeader from "@/components/header";
import ProductIntroduction from "./components/productIntroduction";
import DistributionMode from "./components/distributionMode";
import ConsigneeInformationEdit from "./components/consigneeInformationEdit";

export default {
  name: "acknowledgementOfOrder",
  components: {
    CDWHeader,
    ProductIntroduction,
    DistributionMode,
    ConsigneeInformationEdit,
  },
  data() {
    return {
      state: 0,
      goodsId: "",
      show: false,
      orderInfo: {},
      shipTypeD: "",
    };
  },
  created() {
    this.confirmOrder();
  },
  activated() {},
  methods: {
    showClick() {
      this.$refs.consigneeInformationEdit.onSubmit();
    },
    success(res) {
      this.show = res;
    },
    confirmOrder() {
      this.$http
        .get(
          "/api/shop/order/confirmOrder?goodsId=" + this.$route.query.goodsId,
          {}
        )
        .then((res) => {
          if (res.code == "0") {
            this.orderInfo = res.data;
            this.state = res.data.goodsType;
            if (!this.$route.query.addressState) {
              this.shipTypeD = res.data.shipTypeArr[0];
            } else {
              this.shipTypeD = this.$route.query.addressState;
            }
          }
        });
    },
    confirmFn() {
      this.$router.push({ path: "/index", query:{ token: this.$utils.SessionGet('token')} });
    },
  },
};
</script>
<style scoped lang="less">
.acknowledgementOfOrder {
  padding-bottom: 60px;
  .goods-action {
    position: fixed;
    left: 0;
    bottom: -1px;
    width: 100%;
    box-sizing: border-box;
    display: flex;
    padding: 4px 18px;
    border-top: 1px solid #ebedf0;
    background: #fff;
    .goods-btn {
      flex: 1;
      height: 48px;
      line-height: 48px;
      font-size: 18px;
      text-align: center;
      color: #fff;
      background: #51afb1;
      border-radius: 8px;
      &.disabled {
        background: #ccc;
      }
    }
  }
  /deep/.van-dialog__confirm,
  .van-dialog__confirm:active {
    color: #51afb1;
  }
  /deep/.van-dialog__header {
    font-size: 18px;
    font-weight: 700;
  }
  /deep/.van-dialog__message--has-title {
    font-size: 16px;
    font-weight: 500;
    margin-top: 12px;
  }
  /deep/.van-cell__value {
    color: #323233;
  }
}
</style>
